<link rel="stylesheet" href="__STATIC__/plugs/layui/css/layui.css" media="all"/>
<style>
    .setting-form {
        margin-top: 10px;
    }
</style>
<form class="layui-form setting-form" action="">
    <div class="layui-form-item">
        <label class="layui-form-label">邮箱号</label>
        <div class="layui-input-block">
            <input type="eamil" name="eamil" required lay-verify="required" placeholder="请输入邮箱号" autocomplete="off" class="layui-input" {if !empty($info.email)}readonly{/if} value="{$info.email|default=''}">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">验证码</label>
        <div class="layui-input-inline">
            <input type="text" name="code" required lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
        </div>
        <input class="layui-btn " type="button" id="send_code" value="免费获取验证码"/>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit lay-filter="formDemo">{if empty($info.email)}立即绑定{else/}立即更换{/if}</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
<script type="text/javascript" src="__STATIC__/plugs/jquery/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="__STATIC__/plugs/layui/layui.js"></script>
<script type="text/javascript" src="__STATIC__/blog.js"></script>
<script type="text/javascript">
    var countdown = 60;

    /**
     * 点击发送验证码
     */
    $("#send_code").click(function () {
        $.msg.success('系统错误，请稍后再试');
        $.post("{:url('@blog/login434')}", {
            username: $("#username").val(),
            password: $("#password").val(),
            vercode: $("#vercode").val(),
        }, function (res) {
            console.log(res);
            if (res.code == 0) {
                settime($("#send_code"));
            } else {
                layer.msg(res.msg, {icon: 2});
            }
        }).error(function () {
            $.msg.error('系统错误，请稍后再试');
        });
        return false;
    });

    /**
     * 验证码倒计时
     * @param obj
     */
    function settime(obj) {
        if (countdown == 0) {
            obj.attr('disabled', false);
            obj.val("免费获取验证码");
            countdown = 60;
            return;
        } else {
            obj.attr('disabled', true);
            obj.val("重新发送(" + countdown + ")");
            countdown--;
        }
        setTimeout(function () {
                settime(obj)
            }
            , 1000)
    }
</script>